<template>
  <el-scrollbar style="width: 100%; height: 330px">
    <el-table :data="channelList">
      <el-table-column prop="channelCode" label="货道编号"> </el-table-column>
      <template v-if="isShow">
        <el-table-column label="商品名称">
          <template slot-scope="{ row }">
            <span>{{ row.sku ? row.sku.skuName : "-" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="当前数量">
          <template slot-scope="{ row }">
            <span>{{ row.sku ? row.currentCapacity : "-" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="还可添加">
          <template slot-scope="{ row }">
            <span>{{ row.sku ? row.max : "-" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="补满数量" width="200">
          <template slot-scope="{ row }">
            <el-input-number
              v-if="row.sku"
              v-model="row.expectCapacity"
              controls-position="right"
              :min="0"
              :max="row.max"
              weight="150"
            ></el-input-number>
            <span v-else>货道暂无商品</span>
          </template>
        </el-table-column>
      </template>
      <template v-else>
        <el-table-column label="商品名称" prop="skuName"> </el-table-column>
        <el-table-column prop="expectCapacity" label="补货数量">
        </el-table-column>
      </template>
    </el-table>
  </el-scrollbar>
</template>

<script>
export default {
  props: {
    channelList: {
      type: Array,
      default: () => []
    },
    isShow: {
      type: Boolean,
      default: true
    }
  },
  created () { },
  data () {
    return {}
  },
  methods: {},
  computed: {

  },
  watch: {},
  filters: {},
  components: {}
}
</script>

<style scoped lang='scss'>
.el-scrollbar {
  ::v-deep .el-scrollbar__wrap {
    overflow: unset;
    overflow-x: hidden;
  }
}
</style>
